<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <link rel="stylesheet" href="../lib/css/style.css">
    <link rel="stylesheet" href="../lib/font/css/font-awesome.css">
    <link rel="stylesheet" href="../lib/bootstrap-3.3.7-dist/css/bootstrap.min.css">
    <link rel="stylesheet" href="../lib/bootstrap-3.3.7-dist/css/bootstrap-theme.min.css">
    <script src="../lib/jquery/jquery.js"></script>
    <script src="../lib/vue/vue.js"></script>
    <style>
        html,body,#content{
            width: 100vw;
            height: 100vh;
            overflow: hidden;
            margin: 0 !important;
            padding: 0 !important;
            box-sizing: border-box;
        }
        #content{
            /*display: flex;*/
            /*flex-direction: row;*/
            padding: 10px !important;
        }
        #app{
            width: 600px;
        }
    </style>
</head>
<body>
<div id="content">
    <div id="app">
        <table class="table table-bordered">
            <tr>
                <td>
                    名字：<input type="text">
                </td>
                <td>
                    排序：<input type="text">
                </td>
            </tr>
            <tr>
                <td colspan="100" valign="top" style="vertical-align: top">
                    描述：
                    <textarea class="form-control" name=""  id=""  rows="5"></textarea>
                </td>
            </tr>
        </table>

        <p>人员</p>
        <select multiple class="form-control" :size="ps.length" >
            <option value="123" v-for="item in ps">123321</option>
        </select>

        <a href="javascript:;" @click="add()">add</a>

    </div>
</div>

</body>
</html>
<script>
    function getQueryString(name) {
        var reg = new RegExp('(^|&)' + name + '=([^&]*)(&|$)', 'i');
        var r = window.location.search.substr(1).match(reg);
        if (r != null) {
            return unescape(r[2]);
        }
        return null;
    }
    var app = new Vue({
        el: "#app",
        data:{
            data: {},
            ps:[]
        },
        methods:{
           add(){
               this.ps.push(123)
           }
        },
        mounted(){
            $.get("/api/bpm/org/one", {id: getQueryString("id")}, msg => {
                this.data = msg.data || {}
            }, "json");
        }
    })
</script>